import { useEffect } from 'react'
const FlashItem = props => {
    const { text, id, type, closeTime=1000 } = props
    const close = () => {
        props.flashFn.delFlashAc(id)
    }
    useEffect(() => {
        console.log("FlashItemCom props", props)
        const flashOut = setTimeout(() => {
            close()
        }, closeTime);
        return () => {
            clearTimeout(flashOut)
        }
    }, [props.id])
    
    return (
        <div className={`alert ${type}`} role="alert">
           {
               text
           }
            <button onClick={close} type="button" className="close"  aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
    )
}
export default FlashItem
